<template>
  <div>
    <!-- 添加按钮 -->
    <el-bread></el-bread> 
    <!-- 面包屑 -->
    <el-button type="primary" plain size="small"  @click="add">添加</el-button>

    <!-- 列表渲染 -->
    <v-list @edit='edit'></v-list>
    <!-- 添加弹框 ,接收子的数据,传到子组件-->
    <v-dialog ref="dialog" @cancel='cancel' :info='info'></v-dialog>
  </div>
</template>
<script>
import vList from "./list.vue";
import vDialog from "./dialog.vue";
export default {
  data() {
    return {
        info:{
        // 弹窗开关
        isShow:false,
        isAdd:true//是否是添加
        }

    };
  },
  components: {
    vList,
    vDialog,
  },
  methods: {

    add(){
        console.log(666);
            //   弹出弹窗
        this.info.isShow=true
        // 告诉弹窗是添加功能
        this.info.isAdd = true
    },
    // 子组件改变父组件弹窗开关
    cancel(e){
        this.info.isShow=e
    },
    // 打开编辑弹窗事件
    edit(e){
        this.info.isShow = true
        // 告诉弹窗是编辑功能
        this.info.isAdd = false
        this.$refs.dialog.lookup(e)
      

      

    }

  },
};
</script>
<style scoped>
.el-button {
  margin: 20px;
}
</style>